<template>
  <div style="padding: 10px">
    <lc-sf
      ref="sf"
      :schema="search"
      @submit="submit()"
      moda="search"
      :search-span="searchSpan"
    />
    <lc-tree-st v-if="stModa === 'tree-table'" ref="tree" v-bind="props" />
    <lc-st v-else ref="st" v-bind="props" />
  </div>
</template>
<script setup lang="ts" name="Welcome">
import { computed, onMounted, ref } from "vue";
import LcSf from "../sf/sf.vue";
import LcSt from "../st/st.vue";
import LcTreeSt from "../tree-st/tree-st.vue";
import AddUpdateDrawer from "./add-update-drawer.vue";
import { NzSafeAny, SFInstance } from "../sf/type";
import { STExposeComponent } from "../st/interface";
import { ICurdOption } from "./interface";
import { Helper } from "@/core/helper/helper.service";
import { Tool } from "@/util/tool";
import { Observable } from "rxjs";
import { Http } from "@/core/api/http.service";
const props = defineProps<ICurdOption>();
const st = ref<STExposeComponent>();
const tree = ref<{ tree: STExposeComponent; treeChild: STExposeComponent }>();
const sf = ref<SFInstance>();
const table = computed(() => {
  return props.stModa === "tree-table" ? tree.value?.tree : st.value;
});
const submit = () => {
  table.value?.reset(sf.value?.service?.getValues() || {});
};
const formatUrl = computed(() => {
  return (props.data as string)?.split("?")[0];
});
/** 新增 */
const add = () => {
  childAdd().subscribe(resetTable);
};
const paramsData = computed(() => {
  return props?.expandParams;
});

/** 主要给与 上下级Tree 使用 */
const childAdd = (
  data?: Record<string, NzSafeAny>,
  title?: string,
  model?: string
) => {
  console.log(paramsData.value);
  const params = {
    footer: false,
    ...(props.option || {}),
    i: {
      ...(paramsData.value || {}),
      ...(data ? Tool.deepClone(data) : {})
    },
    record: {
      url: props.data,
      ...(Tool.deepClone(props.record) || {})
    },
    title: `新增${title || props.option?.title}`,
    component: AddUpdateDrawer
  };
  return (model || props.model) === "drawer"
    ? Helper[props?.noCache ? "showDrawer" : "showStaticDrawer"](params)
    : Helper[props?.noCache ? "showDialog" : "showStaticDialog"](params);
};
/** 批量删除 */
const del = (ids: string[]) => {
  Http.of()
    .post(`${formatUrl.value}/delete/many`, {
      ids
    })
    .then(() => {
      Helper.showMessage("批量删除成功");
      resetTable();
    });
};
/** 更新 */
const update = (data: Record<string, NzSafeAny>) => {
  const params = {
    footer: false,
    ...(props.option || {}),
    i: Tool.deepClone(data),
    title: `更新${props.option?.title}`,
    record: {
      url: props.data,
      ...(Tool.deepClone(props.record) || {})
    },
    component: AddUpdateDrawer
  };
  return Helper.showDialog(params);
};
/** 删除一个 */
const delOne = (id: string) => {
  return new Observable(sub => {
    Http.of()
      .delete(`${formatUrl.value}/${id}`)
      .then(() => {
        Helper.showMessage("删除成功");
        sub.next(true);
      });
  });
};
const resetTable = () => {
  table.value?.reset();
};
const addSubject = () => {
  table.value?.add?.subscribe(add);
  table.value?.del?.subscribe(del);
};
onMounted(() => {
  addSubject();
});
defineExpose({
  st: table,
  sf,
  update,
  add: childAdd,
  delOne
});
</script>
../st/interfaces ./interfaces ../sf/types ./interface../st/interface
